<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="th/m/include/head :: head(~{::title}, ~{::style})">
    <meta charset="utf-8">
    <title>消息</title>
    <style type="text/css">
        .createdate {
            font-size: 12px;
            color: #8f8f94;
        }
        /*标题前图标的大小*/
        .mui-table-view .mui-media-object {
            width: 24px;
            height: 24px;
        }
    </style>
</head>
<body>
<div class="mui-content">
    <div class="mui-input-row mui-search" style="margin: 10px;">
        <input type="search" class="mui-input-clear" placeholder="请输入标题">
    </div>
    <div id="pullrefresh" class="mui-scroll-wrapper" style="margin-top: 60px;">
        <div class="mui-scroll">
            <ul class="mui-table-view mui-table-view-chevron">
            </ul>
        </div>
    </div>
</div>
<div th:replace="th/m/include/navbar :: nav(${nav}, false, '', true)"></div>
<script th:inline="javascript">
    var contextPath = [[@{/}]];
    var url = contextPath + "public/message/listNewMsg.do";
    var isUniWebview = [[${nav.isUniWebview}]];
    var params = {"skey": [[${nav.skey}]]};
    var options = {"ajax_params": params, "url": url, "ajaxDatasType": "messages", "isUniWebview": isUniWebview};
    var content = document.querySelector('.mui-content');

    if (mui.os.plus) {
        // 使搜索区域下方空白不致过大，因为搜索框中的input的margin-bottom为15px，而在原生手机端中则不会有此margin-bottom
        $('#pullrefresh').css('margin-top', '-15px');
        // document.addEventListener('plusready', function () {
            var PullToRefrshListApi = new mui.PullToRefrshList(content, options);
            PullToRefrshListApi.loadListData();
        // });

        if (isUniWebview) {
            $('.mui-bar').remove();
        }
    } else {
        // 必须删除顶部标题，而不能是隐藏，否则mui-bar-nav ~ mui-content中的padding-top会使得位置下移
        // $('.mui-bar').remove();

        var PullToRefrshListApi = new mui.PullToRefrshList(content, options);
        PullToRefrshListApi.loadListData();
    }

    // ios中不支持下拉刷新，在mui.PullToRefresh.wx.js中mui.init初始化的时候去掉了下拉down属性
    // 但是去掉后下拉配置，会使得页面中.mui-scroll-wrapper的样式变为了：margin-top: -15px
    if (mui.os.plus && mui.os.ios) {
        jQuery('.mui-scroll-wrapper').css({'margin-top': '60px'});
    }
</script>
</body>
</html>